<template>
    <div>
        <div style="float:left;margin-right:20px">
            <Button type="primary" shape="circle" @click="onAdd">添加数据</Button>
            <Button type="primary" shape="circle" @click="deleteSelection">删除所选</Button>
        </div>
        <div style="width:300px;display:inline-block;">
            <Input v-model="filter.keyWords">
            <Button slot="append" type="primary" icon="ios-search" @click="searchData"></Button>
            </Input>
        </div>
        <Table border :columns="columns7" :data="filter.data" @on-selection-change="onSelectionChange"></Table>
        <Page :total="filter.total" size="small" show-total show-elevator show-sizer
              @on-change="onChange" @on-page-size-change="onPageSizeChange"></Page>

        <Modal
                v-model="modal"
                title="数据操作"
                width="800px"
        >
            <Form ref="formValidate" :model="formValidate" :rules="ruleValidate" :label-width="100" style="margin-right:50px">
                <FormItem label="评论人" prop="commentator">
                    <Input v-model="formValidate.commentator"  placeholder="请输入用户名"></Input>
                </FormItem>
                <FormItem label="评论内容"  prop="comment">
                        <!-- quill-editor -->
                        <quill-editor ref="myTextEditor"
                                      v-model="formValidate.comment"
                        >
                        </quill-editor>
                </FormItem>
                <FormItem>
                    <Button type="primary" @click="handleSubmit('formValidate')">提交</Button>
                    <Button type="ghost" @click="handleReset('formValidate')" style="margin-left: 8px">重置</Button>
                </FormItem>
            </Form>
        </Modal>
    </div>
</template>
<script>
	import baseCate from '../base/cateBase'
	import base from '../base/base'

	export default {
		mixins: [baseCate,base],
		data(){
			return {
				module:'comment',
                newsId:"",
				columns7: [
					{
						type: 'selection',
						width: 60,
						align: 'center'
					},
					{
						title: '评论人',
						key: 'commentator',
					},
					{
						title: '评论内容',
						key: 'comment'
					},
					{
						title: '时间',
						key: 'date'
					},
					{
						title: '操作',
						key: 'action',
						width: 200,
						align: 'center',
						render: (h, params) => {
							return h('div', [
								h('Button', {
									props: {
										type: 'primary',
										size: 'small'
									},
									style: {
										marginRight: '5px'
									},
									on: {
										click: () => {
											this.show(params.row)
										}
									}
								}, '查看'),
								h('Button', {
									props: {
										type: 'error',
										size: 'small'
									},
									style: {
										marginRight: '5px'
									},
									on: {
										click: () => {
											this.remove(params.row._id)
										}
									}
								}, '删除')
							]);
						}
					}
				],
			}
		},
        methods:{
			getId(){
				this.filter.cateId=this.$route.params.id;
				console.log(this.filter.cateId);
				this.getData();
            }
		},
        watch:{
			'$route':'getId'
        }
	}
</script>